﻿@model SDCloudSolution.SDCloud.Web.Models.Model.ModelListViewModel

@{
    Layout = MVC.Shared.Views._AuthorizedLayout;
    ViewBag.Title = "Models list";
}

@section scripts {
    <script src="~/Scripts/js/libs/require/require.js"></script>
    <script src="~/Scripts/app.js"></script>
    <script src="~/Scripts/sdCloud/my.models.js"></script>
}



<div id="my-models-table">
    <div class="page-header oj-flex oj-sm-flex-items-initial">
        <h1 class="oj-flex-item">My models</h1>
        <h1 class="oj-helper-margin-start-auto oj-flex-item">
            <a class="oj-button-primary" href="@Url.Action(MVC.Models.Create())"
               data-bind="ojComponent: {component: 'ojButton'}">
                <span class="fa fa-plus"></span>
                Add a new model
            </a>
        </h1>
    </div>
    @if (Model.Items.Count > 0)
    {
        <div class="oj-flex oj-flex-items-pad">
            @foreach (var item in Model.Items)
            {
                <div class="oj-flex-item oj-sm-12 oj-lg-4 oj-md-4 oj-xl-3">
                    <div class="oj-panel oj-margin-bottom">
                        <div class="oj-header-border bold">@Html.ActionLink(item.Name, MVC.Models.View(item.ModelId))</div>
                        @if (string.IsNullOrEmpty(item.ModifyDate))
                        {
                            <div>
                                Created @item.CreatedDate
                            </div>
                        }
                        else
                        {
                            <div>
                                Modified @item.ModifyDate
                            </div>
                        }
                        <br />
                        <div class="oj-flex-item oj-panel oj-panel-alt2">
                            <div>
                                Featured Statistics
                            </div>
                        </div>
                        <br />
                        <div>
                            <a id="edit" href="@Url.Action(MVC.Models.Edit(item.ModelId))"
                               data-bind="ojComponent: {
                                          component: 'ojButton',
                                          icons: {start:'fa fa-pencil-square-o'}
                                          }">Edit</a>
                            <form method="POST" action="@Url.Action(MVC.Models.Delete(item.ModelId))" style="display: inline-block;">
                                <button type="submit" class="button-error"
                                        data-bind="ojComponent: {
                                          component: 'ojButton',
                                          icons: {start:'fa fa-trash-o'}
                                      }">
                                    Delete
                                </button>
                            </form>
                        </div>
                    </div>
                </div>
            }
        </div>
    }
    else
    {
        <p>
            We don't have any model in SDCloud
        </p>
    }
</div>
